import React, { useState, createRef } from 'react';
import { message } from 'antd';
import styles from '../style/login.module.less'
import { json, useNavigate } from "react-router-dom";
import { login } from '../apis/home'
export default function Login() {
    const [userName, setUserName] = useState("")
    const [passWord, setPassWord] = useState("")
    const userNameRef = createRef();
    const passWordNameRef = createRef();
    const navigate = useNavigate()
    const [messageApi, contextHolder] = message.useMessage();
    // 登录
    const getSubmit = () => {
        getLogin({ username: userName, password: passWord })
    }
    const getLogin = async (res) => {
        const { data } = await login(res)
        if (data.state === 1) {
            messageApi.open({
                type: 'success',
                content: '登录成功',
                duration: 10,
            });
            setTimeout(() => {
                navigate('/home')
            }, 1000)
            sessionStorage.setItem('token', data.token)
            localStorage.setItem('areaId', data.area.area_id)
            localStorage.setItem('areaLevel', data.area.area_level)
            localStorage.setItem('shi_id', data.user.shi)
            localStorage.setItem('roleId', data.user.role_id)
            localStorage.setItem('sheng_id', data.user.sheng)
            localStorage.setItem('weather', JSON.stringify((data.area.weather)[0]))
            localStorage.setItem('xianName', data.user.xian_name)
            localStorage.setItem('saleTime', JSON.stringify(data.lastQuarter))
            sessionStorage.setItem('img', JSON.stringify({ fileShowUrl: data.user.fileShowUrl, fileUpload: data.user.fileUpload }))
            sessionStorage.setItem('map', data.area.area_map_url)
        } else {
            messageApi.open({
                type: 'error',
                content: data.msg,
                duration: 10,
            });
        }
    }
    return (
        <div>
            {contextHolder}
            <div className={styles.main}>
                <div className={styles.mainChild}>
                    <h3>农药监管平台</h3>
                    <div className={styles.inputDiv}>
                        <form>
                            <label>
                                <span>
                                    账号
                                </span>
                                <input type="text" ref={userNameRef} name="" value={userName} onChange={() => {
                                    setUserName(userNameRef.current.value)
                                }} />
                            </label>
                            <label>
                                <span>
                                    密码
                                </span>
                                <input type="password" ref={passWordNameRef} name="" value={passWord} onChange={() => {
                                    setPassWord(passWordNameRef.current.value)
                                }} />
                            </label>
                            <button onClick={(e) => {
                                e.preventDefault();
                                getSubmit()
                            }}>登录</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    )
}

